<include file="public:header"/>
<include file="public:sidebar"/>
<style>
.layui-layer.layui-layer-page[type="page"] { max-width: 100% !important; }
</style>
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            活动管理
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
            <li class="active">活动</li>
        </ol>
    </section>
    <hr>
    <!-- Main content -->
    <section class="content">
        <div class="col-md-12">
            <div class="tools">
                <div class="tools-button">
                    <a href="{:Url('article/add')}" class="layui-btn layui-btn-sm layui-btn-radius layui-btn-normal">
                        <i class="layui-icon">&#xe654;</i>添加
                    </a>
                    <!--<a class="layui-btn layui-btn-sm layui-btn-radius layui-btn-danger deleteAll">-->
                        <!--<i class="layui-icon">&#xe640;</i>删除-->
                    <!--</a>-->
                </div>
                <div class="tool-search" style="margin-top: 10px;">
                    <form class="layui-form" autocomplete="off">
                        <div class="layui-inline">
                            <input type="text" name="title" placeholder="请输入标题"
                                   class="layui-input">
                            <input type="hidden" name="page" id="pages" value="">
                            <input type="hidden" name="table" value="article">
                        </div>
                        <!--<div class="layui-inline">-->
                            <!--<input type="text" name="mch_title" placeholder="请输入商户名"-->
                                   <!--class="layui-input">-->
                        <!--</div>-->
                        <div class="layui-inline">
                            <select name="status">
                                <option value=""></option>
                                <option value="1">未审核</option>
                                <option value="2">正常</option>
                                <option value="3">已禁用</option>
                            </select>
                        </div>
                        <div class="layui-inline">
                            <input type="text"  placeholder="请选择时间"
                                   readonly name="date" style="width: 200px"
                                   class="layui-input" id="test1">
                        </div>
                        <div class="layui-inline">
                            <button class="layui-btn" lay-submit lay-filter="search">搜索</button>
                        </div>
                    </form>
                </div>
            </div>
            <table class="table layui-table">
                <thead>
                     <tr>
                         <!--<th>ID</th>-->
                         <th>标题</th>
                         <th>发布人</th>
                         <th class="hidden-sm hidden-xs">公众号</th>
                         <th class="hidden-sm hidden-xs">商户</th>
                         <th class="hidden-sm hidden-xs">封面图</th>
                         <th class="hidden-sm hidden-xs">独立访客(UV)</th>
                         <th class="hidden-sm hidden-xs">浏览次数(PV)</th>
                         <th class="hidden-sm hidden-xs">点赞</th>
                         <th class="hidden-sm hidden-xs">失败原因</th>
                         <th>状态</th>
                         <th class="hidden-sm hidden-xs">区域</th>
                         <th class="hidden-sm hidden-xs">发布时间</th>
                         <th class="hidden-sm hidden-xs">结束时间</th>
                         <th></th>
                    </tr>
                </thead>
                <tbody>
                    <notempty name="list">
                        <volist name="list" id="vo">
                            <tr>
                                <!--<td>{$vo.id}</td>-->
                                <td class="tips" data-tips="{$vo.title}">{$vo.title|sub_str=0,10}</td>
                                <td>{$vo.author}</td>
                                <td class="hidden-sm hidden-xs">{$vo.extend}</td>
                                <td class="hidden-sm hidden-xs">{$vo.mch.name}</td>
                                <td class="hidden-sm hidden-xs">
                                    <img src="{$vo.image}" alt="{$vo.title}" width="30">
                                </td>
                                <td class="hidden-sm hidden-xs">{$vo.hits}</td>
                                <td class="hidden-sm hidden-xs">{$vo.hits1}</td>
                                <td class="hidden-sm hidden-xs">{$vo.love}</td>
                                <td class="hidden-sm hidden-xs tips" data-tips="{$vo.fail_info}">
                                    {$vo.fail_info|substr=0,10}
                                </td>
                                <td>
                                    <eq name="vo.status" value="1">未审核</eq>
                                    <eq name="vo.status" value="2">正常</eq>
                                    <eq name="vo.status" value="3">禁用</eq>
                                    <eq name="vo.status" value="4">审核失败</eq>
                                </td>
                                <td class="hidden-sm hidden-xs">{$vo.location}</td>
                                <td class="hidden-sm hidden-xs">{$vo.create_time}</td>
                                <td class="hidden-sm hidden-xs">{$vo.finish_time}</td>
                                <td style="width:230px">
                                    <a href="{:Url('article/add?id='.$vo['id'])}">编辑</a>
                                    <empty name="mc_id">
                                        <eq name="vo.status" value="1">
                                            <a href="{:Url('article/chack_status')}" class="checks"  data-id="{$vo.id}" data-status="2">审核</a>
                                        </eq>
                                    </empty>
                                    <eq name="vo.status" value="2">
                                        <a href="{:Url('article/chack_status')}"  class="checks" data-id="{$vo.id}" data-status="3">禁用</a>
                                    </eq>
                                    <eq name="vo.status" value="3">
                                        <a href="{:Url('article/chack_status')}"  class="checks" data-id="{$vo.id}" data-status="2">正常</a>
                                    </eq>
                                    <a href="{:Url('article/comment?id='.$vo['id'])}">留言</a>
                                    <notempty name="mc_id">
                                        <eq name="is_vip" value="1">
                                            <a href="{:Url('article/lottery_log?id='.$vo['id'])}">中奖记录</a>
                                            <a href="{:Url('article/lottery?id='.$vo['id'])}" class="checked"
                                               data-status="{$vo.status}">设置抽奖</a>
                                            <a href="{:Url('article/location?id='.$vo['id'])}" class="location"
                                               data-status="{$vo.status}" data-id="{$vo.id}">投放区域</a>
                                            <empty name="$vo.qrcode">
                                                <a href="{:Url('article/create_qrcode?id='.$vo['id'])}" class="checked"
                                                   data-status="{$vo.status}">生成推广码</a>
                                                <else/>
                                                <a href="javascript:;" class="check-qrcode" data-id="{$vo.id}">推广码</a>
                                            </empty>
                                        </eq>
                                        <else/>
                                        <a href="{:Url('article/lottery_log?id='.$vo['id'])}" class="checked"
                                           data-status="{$vo.status}">中奖记录</a>
                                        <a href="{:Url('article/lottery?id='.$vo['id'])}" class="checked"
                                           data-status="{$vo.status}">设置抽奖</a>
                                        <a href="{:Url('article/location?id='.$vo['id'])}" class="location"
                                           data-status="{$vo.status}" data-id="{$vo.id}">投放区域</a>
                                        <empty name="$vo.qrcode">
                                            <a href="{:Url('article/create_qrcode?id='.$vo['id'])}" class="checked"
                                               data-status="{$vo.status}">生成推广码</a>
                                            <else/>
                                            <a href="javascript:;" class="check-qrcode" data-id="{$vo.id}">推广码</a>
                                        </empty>
                                    </notempty>
                                    <a href="javascript:;" onclick="del('{$vo.id}')">删除</a>
                                </td>
                            </tr>
                        </volist>
                    </notempty>
                </tbody>
            </table>
            <div class="pull-right" id="page"></div>
        </div>
    </section>
</div>
<div class="locations" style="display: none;">
    <form class="layui-form" id="form1" autocomplete="off">
        <div class="layui-form-item" style="margin-top: 20px;">
            <label class="layui-form-label" style="width:120px;">区域</label>
            <input type="hidden" name="id" id="ids" value="">
            <div class="layui-input-block">
                <div class="col-sm-3 provice" style="padding-left: 0;"></div>
                <div class="col-sm-3 city"></div>
                <div class="col-sm-4 area"></div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" style="width:120px;">详细地址</label>
            <div class="layui-input-block">
                <input type="text" name="address"
                   placeholder="详细地址" autocomplete="off" style="width:220px;" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 120px;">
            <button class="layui-btn" lay-submit lay-filter="address">添加</button>
        </div>
    </form>
</div>
<include file="public:footer"/>
<script id="demo" type="text/html">
    {{#  layui.each(d.data, function(index, item){ }}
    <tr>
        <!--<td>-->
            <!--{{item.id}}-->
        <!--</td>-->
        <td class="tips" data-tips="{{item.title}}">{{item.title?item.title.substring(0,10):''}}</td>
        <td>{{item.author}}</td>
        <td class="hidden-sm hidden-xs">{{item.extend}}</td>
        <td class="hidden-sm hidden-xs">{{item.mch.name}}</td>
        <td class="hidden-sm hidden-xs">
            <img src="{{item.image}}" width="30">
        </td>
        <td class="hidden-sm hidden-xs">{{item.hits}}</td>
        <td class="hidden-sm hidden-xs">{{item.hits1}}</td>
        <td class="hidden-sm hidden-xs">{{item.love}}</td>
        <td class="hidden-sm hidden-xs tips" data-tips="{{item.fail_info}}">
            {{item.fail_info?item.fail_info.substring(0,10):''}}
        </td>
        <td>
            {{#  if(item.status === 1){ }}
            未审核
            {{#  } }}
            {{#  if(item.status === 2){ }}
            正常
            {{#  } }}
            {{#  if(item.status === 3){ }}
            禁用
            {{#  } }}
            {{#  if(item.status === 4){ }}
            审核失败
            {{#  } }}
        </td>
        <td class="hidden-sm hidden-xs">{{ item.location }}</td>
        <td class="hidden-sm hidden-xs">{{item.create_time}}</td>
        <td class="hidden-sm hidden-xs">{{item.finish_time}}</td>
        <td style="width:220px">
            <a href="{:Url('article/add')}?id={{item.id}}">编辑</a>
            <empty name="mc_id">
                {{#  if(item.status === 1){ }}
                <a href="{:Url('article/chack_status')}" class="checks" data-id="{{item.id}}" data-status="2">审核</a>
                {{#  } }}
            </empty>
            {{#  if(item.status === 2){ }}
            <a href="{:Url('article/chack_status')}" class="checks"  data-id="{{item.id}}" data-status="3">禁用</a>
            {{#  } }}
            {{#  if(item.status === 3){ }}
            <a href="{:Url('article/chack_status')}" class="checks"  data-id="{{item.id}}" data-status="2">正常</a>
            {{#  } }}
            <a href="{:Url('article/comment')}?id={{item.id}}">留言</a>
            <notempty name="mc_id">
                <eq name="is_vip" value="1">
                    <a href="{:Url('article/lottery_log')}?id={{item.id}}" class="checked"
                       data-status="{{ item.status }}">中奖纪录</a>
                    <br/>
                    <a href="{:Url('article/lottery')}?id={{item.id}}" class="checked"
                       data-status="{{ item.status }}">设置抽奖</a>
                    <a href="{:Url('article/location')}?id={{item.id}}" class="location"
                       data-status="{{ item.status }}" data-id="{{item.id}}">投放区域</a>
                    {{#  if(item.qrcode == ''){ }}
                    <a href="{:Url('article/create_qrcode')}?id={{item.id}}" class="checked"
                       data-status="{{ item.status }}">生成推广码</a>
                    {{#  } }}
                    {{#  if(item.qrcode != ''){ }}
                    <a href="javascript:;" class="check-qrcode" data-id="{{item.id}}">推广码</a>
                    {{#  } }}
                </eq>
                <else/>
                <a href="{:Url('article/lottery_log')}?id={{item.id}}" class="checked"
                   data-status="{{ item.status }}">中奖纪录</a>
                <br/>
                <a href="{:Url('article/lottery')}?id={{item.id}}" class="checked"
                   data-status="{{ item.status }}">设置抽奖</a>
                <a href="{:Url('article/location')}?id={{item.id}}" class="location"
                   data-status="{{ item.status }}"  data-id="{{item.id}}">投放区域</a>
                {{#  if(item.qrcode == ''){ }}
                <a href="{:Url('article/create_qrcode')}?id={{item.id}}"
                   data-status="{{ item.status }}">生成推广码</a>
                {{#  } }}
                {{#  if(item.qrcode != ''){ }}
                <a href="javascript:;" class="check-qrcode" data-id="{{item.id}}">推广码</a>
                {{#  } }}
            </notempty>
            <a href="javascript:;" onclick="del('{{item.id}}')">删除</a>
        </td>
    </tr>
    {{#  }); }}
</script>
<script id="provice" type="text/html">
    <select name="pro" required lay-filter="pro">
        <option value="">--请选择省--</option>
        {{#  layui.each(d.data.list, function(index, item){ }}
            {{#  if(item.provinceid === d.data.info.pro){ }}
            <option value="{{item.provinceid}}" selected>{{item.province}}</option>
            {{#  } }}
            {{#  if(item.province !== d.data.info.pro){ }}
            <option value="{{item.provinceid}}">{{item.province}}</option>
            {{#  } }}
        {{#  }); }}
    </select>
</script>
<script id="city" type="text/html">
    <select name="city" id="cities" lay-filter="city">
        <option value="">--请选择市--</option>
        {{#  layui.each(d.data.list, function(index, item){ }}
            {{#  if(Number(item.cityid) === d.data.info.city){ }}
            <option value="{{item.cityid}}" selected>{{item.city}}</option>
            {{#  } }}
            {{#  if(Number(item.cityid) !== d.data.info.city){ }}
            <option value="{{item.cityid}}">{{item.city}}</option>
            {{#  } }}
        {{#  }); }}
    </select>
</script>
<script id="area" type="text/html">
    <select name="area" id="areas" lay-filter="area">
        <option value="">--请选择县--</option>
        {{#  layui.each(d.data.list, function(index, item){ }}
            {{#  if(Number(item.areaid) === d.data.info.area){ }}
            <option value="{{item.areaid}}" selected>{{item.area}}</option>
            {{#  } }}
            {{#  if(Number(item.areaid) !== d.data.info.area){ }}
            <option value="{{item.areaid}}">{{item.area}}</option>
            {{#  } }}
        {{#  }); }}
    </select>
</script>
<script>
    var currentPage = 1;
    var url = "{:Url('article/index')}";
    var ids = [];
    $(document).ready( function () {
        layui.use(['layer','form','laydate','laypage','laytpl'],function () {
            var layer = layui.layer,
                laydate = layui.laydate,
                form = layui.form,
                laypage = layui.laypage,
                laytpl = layui.laytpl;

            form.on('submit(search)',function (data) {
                init();
                return false;
            });

            laydate.render({
                elem: '#test1',
                type: 'date',
                range: '~',
                format: 'yyyy-MM-dd',
            });
            laypage.render({
                elem: 'page',
                count: Number('{$total}'),
                limit: 10,
                layout: ['prev','page','next','skip'],
                theme: '#c00',
                jump: function(obj, first){
                    $('#pages').val(obj.curr);
                    if(!first){
                        init();
                    }
                }
            });
            $(document).on('click','.checked',function (e) {
               var status  = $(this).attr('data-status');
               if(Number(status)===1 || Number(status)===4){
                   layer.alert('待活动审核中或审核失败',{icon:5});
                   return false;
               }
            });
            form.on('select(pro)', function(data){
                var id = $('#ids').val();
                $.get('{:Url("article/get_city")}',{pid: data.value,id: id},function (result) {
                    var getTpl = city.innerHTML;
                    laytpl(getTpl).render(result, function(html){
                        $('.city').empty().html(html);
                        $('.area').empty();
                        form.render()
                    });
                })
            });
            form.on('select(city)', function(data){
                var id = $('#ids').val();
                $.get('{:Url("article/get_areas")}',{cid: data.value,id: id},function (result) {
                    var getTpl = area.innerHTML;
                    laytpl(getTpl).render(result, function(html){
                        $('.area').empty().html(html);
                        form.render()
                    });
                });
            });
            var window = 0;
            $(document).on('click','.location',function (e) {
                e.preventDefault();
                var id = $(this).attr('data-id'),
                    status = $(this).attr('data-status');
                if(Number(status)===1){
                    layer.alert('待活动审核中或审核失败',{icon:5});
                    return false;
                }
                $('#ids').val(id);
                $.get('{:Url("article/get_pro")}',{id: id},function (result) {
                    var getTpl = provice.innerHTML;
                    laytpl(getTpl).render(result, function(html){
                        $('.provice').html(html);
                        if(result.data.info){
                            initCity(result.data.info.pro,result.data.info.id);
                        }
                        form.render()
                    });
                });
                window = layer.open({
                    type:1,
                    content: $('.locations'),
                    shade: false,
                    title: '选择投放区域',
                    area: ['750px', '320px'],
                    end:function () {
                        $('#ids').val('');
                        $('.provice').html('');
                        $('.city').html('');
                        $('.area').html('');
                    }
                });
            });
            form.on('submit(address)',function (data) {
                layer.close(window);
                $.post('{:Url("article/add_address")}',data.field,function (result) {
                    if(result.code){
                        layer.alert(result.msg,{icon: 5});
                        return false;
                    }
                    layer.alert(result.msg,{icon:6,end:function () {
                        init();
                    }});
                });
                return false;
            });
            $(document).on('click','.checks',function (e) {
                e.preventDefault();
                var id = $(this).attr('data-id'),
                    status = $(this).attr('data-status'),
                    href = $(this).attr('href');

                layer.confirm('活动审核?', {
                    icon: 3,
                    title:'是否审核通过',
                    btn: ['确认通过', '拒绝通过']
                }, function(index){
                    $.post(href,{id: id,status: 2},function (result) {
                        if(result.code){
                            layer.alert(result.msg,{icon: 5});
                            return false;
                        }
                        layer.alert(result.msg,{icon:6,end:function () {
                            init();
                        }});
                    });
                    layer.close(index);
                },function () {
                    layer.prompt('请填写拒绝原因',function(value, index, elem){
                        $.post(href,{id: id,status: 4,fail_info:value},function (result) {
                            if(result.code){
                                layer.alert(result.msg,{icon: 5});
                                return false;
                            }
                            layer.alert(result.msg,{icon:6,end:function () {
                                init();
                            }});
                        });
                        layer.close(index);
                    });
                });
            });
            $(document).on('click','.check-qrcode',function (e) {
                e.preventDefault();
                var id = $(this).attr('data-id');
                $.post('get_qrcode',{id: id},function (result) {
                    if(result.code){
                        layer.alert(result.msg);
                        return false;
                    }
                    layer.open({
                        title: '查看二维码',
                        type: 1,
                        closeBtn: 1, //不显示关闭按钮
                        anim: 2,
                        shadeClose: true, //开启遮罩关闭
                        content: '<img src="data:image/png;base64,' + result.data.qrcode + '">'
                    });
                 });
            });
        });
    });
    function init(){
        var data = $('form').serialize();
        layui.use(['laytpl','layer'],function () {
            var laytpl = layui.laytpl,
                layer = layui.layer;
            var index = layer.load(2,{shade: [0.8, '#000']});
            $.post(url,data,function (result) {
                layer.close(index);
                if(result.code === 0){
                    var getTpl = demo.innerHTML;
                    laytpl(getTpl).render(result.data, function(html){
                        $('table>tbody').html(html);
                        $('#pages').val(result.data.current_page);
                    });
                }
            });
        });
    }
    function initCity(cid,id){
        layui.use(['laytpl','layer','form'],function () {
            var laytpl = layui.laytpl,
                layer = layui.layer,
                form = layui.form;
            $.get('{:Url("article/get_city")}', {pid: cid, id: id}, function (result) {
                var getTpl = city.innerHTML;
                laytpl(getTpl).render(result, function (html) {
                    if(result.data.info){
                        initArea(result.data.info.city,result.data.info.id);
                    }
                    $('.city').empty().html(html);
                    form.render();
                });
            })
        });
    }
    function initArea(cid,id){
        layui.use(['laytpl','layer','form'],function () {
            var laytpl = layui.laytpl,
                form = layui.form;
            $.get('{:Url("article/get_areas")}', {cid: cid, id: id}, function (result) {
                var getTpl = area.innerHTML;
                laytpl(getTpl).render(result, function (html) {
                    $('.area').empty().html(html);
                    form.render()
                });
            })
        });
    }
    function del(id) {
        layer.confirm('您确定要删除吗，删除后不能恢复?', {icon: 3, title:'提示'}, function(index){
            $.post('{:Url("article/del")}',{id: id},function (result) {
                if(result.code ){
                    layer.alert(result.msg,{icon: 5});
                    return false;
                }
                layer.alert(result.msg,{icon: 6,end:function () {
                    init();
                }});
            });
            layer.close(index);
        });
    }
</script>
